<?php 
 
$num1=isset($_POST['num1'])?($_POST['num1']):0;
$num2=isset($_POST['num2'])?($_POST['num2']):0;
$ysf=isset($_POST['ysf'])?($_POST['ysf']):'+';
// echo $ysf;
switch ($ysf) {
  case '+':
    $hou = $num1 + $num2;
    break;
  case '-':
    $hou = $num1 - $num2;
    break;
  case '*':
    $hou = $num1 * $num2;
    break;
  case '/':
    $hou = $num1 / $num2;
    break;
  default:
    $hou = 0;
    break;
}
 
 
 ?>











 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
 <head>
 	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
 	<title>Document</title>
 	<style type="text/css">
 	*{
 		padding: 0 ;
 		margin: 0;
 	}
 	a{text-decoration: none;}
    div.box{

      width: 120px;
      height: 150px;
      margin: 30px auto;
      background: #141414;
      border: solid 3px #5D6974;
      border-radius: 3%;
    }
    div.box .xianshi{
    	width: 116px;
    	height: 30px;
    	position:relative;
    	margin: 2px auto;
    	

    }
    div.box .xianshi h2{
    	display: block;
    	float: right;
    }

    div.box .anjian{
    	width: 116px;
    	height: 110px;
    	
    	margin: 5px auto;
    }

    div.box .anjian a{
    	margin-top: 5px;
    	margin-left: 6px;
    	width: 22px;
    	height: 20px;
    	display: block;
    	background: white;
      float: left;
      border-radius: 5%;
      text-indent: 7px;
    }
    
    div.box .anjian input{
    	margin-top: 5px;
    	margin-left: 6px;
    	width: 22px;
    	height: 20px;
    	display: block;
    	background: white;
        float: left;
    }
     div.box .xianshi input{
      position: absolute;
      left: 0px;top: 0px;
      width: 116px;
      height: 30px;
     }








 	</style>
 	<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
 	<script type="text/javascript">
     $(function(){
      var shuzu='';
     	$('div.box .anjian a.a1').click(function() {
        // $(this).css({'background':'red'}).siblings('a').css({'background':'white'});
     		var	shuzi=$(this).text();
        shuzu=shuzu+shuzi;
        $('.num2').val(shuzu);
        
     	});
     	$('div.box .anjian a.ysfh').click(function() {
        $(this).css({'background':'red'}).siblings('a').css({'background':'white'});
        var w=$(this).text();
        // alert(ysf);
        $('.ysf').val(w);

        $('.num1').val($('.num2').val());
        shuzu='';
        $('.num2').val('');

      });

     })
 	</script>

 </head>
 <body>
 	<div class="box">
 	    <div class="xianshi">
      <form action="" method="post">
        <input type="text" class="num1" name="num1" />
        <input type="text" class="ysf" name="ysf" />
        <input type="text" class="num2" name="num2" value="<?php echo $hou;?>" />
      <!-- </form> -->
 	      
 	    </div>
 	    <div class="anjian">
 	        <a class="a1" href="javascript:void(0)">7</a>
 	        <a class="a1" href="javascript:void(0)">8</a>
 	        <a class="a1" href="javascript:void(0)">9</a>
 	        <a class="ysfh" href="javascript:void(0)">+</a>
 	        <a class="a1" href="javascript:void(0)">4</a>
 	        <a class="a1" href="javascript:void(0)">5</a>
 	        <a class="a1" href="javascript:void(0)">6</a>
 	        <a class="ysfh" href="javascript:void(0)">-</a>
 	        <a class="a1" href="javascript:void(0)">1</a>
 	        <a class="a1" href="javascript:void(0)">2</a>
 	        <a class="a1" href="javascript:void(0)">3</a>
 	        <a class="ysfh" href="javascript:void(0)">*</a>
 	        <a class="a1" href="javascript:void(0)">0</a>
 	        <a class="ling" href="javascript:void(0)">M</a>
 	      <!-- <form action="" method="post"> -->
 	    		<input type="submit" value="=" />
 	    	</form>
 	        <a class="ysfh" href="javascript:void(0)">/</a>
 	    	

 	    </div>
 		
 	</div>
 </body>
 </html>